<!doctype html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>简单实用的jQuery左侧固定侧边栏插件</title>
    <link rel="stylesheet" type="text/css" href="http://www.jqhtml.com/jquery/font-awesome.4.6.0.css">
    <link href="css/app.css" rel="stylesheet" type="text/css">
	<!--[if IE]>
		<script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
	<![endif]-->
</head>
<body>
	<div id="contentWrapper">

	    <div id="contentLeft">

	        <ul id="leftNavigation">

	            <li class="active">
	                <a href="#"><i class="fa fa-coffee leftNavIcon"></i> About us</a>
	                <ul>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Our History</a>
	                    </li>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Our Team</a>
	                    </li>
	                </ul>
	            </li>
	            <li>
	                <a href="#"><i class="fa fa-flask leftNavIcon"></i> Products</a>
	                <ul>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Garden</a>
	                    </li>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Office</a>
	                    </li>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Home</a>
	                    </li>
	                </ul>
	            </li>
	            <li>
	                <a href="#"><i class="fa fa-truck leftNavIcon"></i> Services</a>
	                <ul>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Garden</a>
	                    </li>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Office</a>
	                    </li>
	                    <li>
	                        <a href="#"><i class="fa fa-angle-right leftNavIcon"></i> Home</a>
	                    </li>
	                </ul>
	            </li>
	            <li class="clickable">
	                <a href="#"><i class="fa fa-envelope-o leftNavIcon"></i> Contact us</a>
	            </li>

	        </ul>

	    </div>

	    <div id="contentRight">

	        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Alias consequatur delectus eius laborum reprehenderit. A amet dignissimos explicabo maiores nisi nulla placeat quae reiciendis repudiandae tempora tempore, vero? Ea, optio?</p>
			
	    </div>

	</div>


	<script src="http://www.jqhtml.com/jquery/jquery-1.10.2.js"></script>
	<script>window.jQuery || document.write('<script src="js/jquery-2.1.1.min.js"><\/script>')</script>
	<script src="js/jquery.ssd-vertical-navigation.min.js"></script>
	<script src="js/app.js"></script>
</body>
</html>